<template>
  <component :is="componentName" :form="form"></component>
</template>

<script lang="ts">

import { Vue, Component, Prop, Emit, Ref } from 'vue-property-decorator'
import DocPermsForm from '../doc-perms-form/index.vue'
import DocDeleteForm from '../doc-delete-form/index.vue'
import DocUpdateForm from '../doc-update-form/index.vue'
import DocAddForm from '../doc-add-form/index.vue'

@Component({
  components: { DocPermsForm, DocDeleteForm, DocUpdateForm, DocAddForm }
})
export default class DynamicForm extends Vue {
  @Prop() form!: any

  @Prop() def!: any

  get componentName () {
    return (this.def?.action || '').replace(/_/g, '-') + '-form'
  }
}
</script>
